<template>
  <div class="page-style">
    <el-row>
      <el-col :span="10">
        <el-form ref="form" :model="form" label-width="100px" class="demo-ruleForm">
          <el-form-item label="条码类型">
            <el-select v-model="form.type" placeholder="请选择条码类型">
              <el-option
                v-for="item in codeType"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="解除条码">
            <el-input v-model="form.bar_code" type="Number" autocomplete="off" clearable />
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="submitForm">解除</el-button>
          </el-form-item>
        </el-form>
        <el-card class="card">
          <div slot="header">
            <span>说明:</span>
          </div>
          <ul>
            <li>输入完成后,请再次确认码的准确性</li>
            <!-- <li>新标签为未关联标签</li>
            <li>替换后就标签自动作废</li> -->
          </ul>
        </el-card>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { barCodeUnbindApi } from '@/api/exception-harding'

export default {
  data() {
    return {
      form: {
        type: '',
        bar_code: ''
      },
      codeType: [
        {
          value: '1',
          label: '大码'
        },
        {
          value: '2',
          label: '中码'
        },
        {
          value: '3',
          label: '小码'
        }
      ]
    }
  },
  created() {
    const arr = ['1611062613', '1871327274', '1616680060', '1611799320', '1634237595', '1612959798', '1761591096', '1870473477', '1665891052', '1760574451', '1664815050', '1667667755', '1666665844', '1664356539',
      '1682320022', '1767527734', '1666828911', '1646093566', '1640867596', '1640301499', '18973557870', '1641301867', '1766496328', '1644998634',
      '1645039844', '1618745089', '1610998890', '1764251453', '1869357082', '1772747943', '1667207685', '1667656884', '1664537479', '1616783610', '1619971738',
      '1768106446', '1640241738', '1640895311', '1617989368', '1873917751', '1612080616', '1636029331', '1612640222', '1617444603', '1612952301', '1612041754',
      '1641280548', '1661728603', '1637582942', '1765758117', '1870101622', '1644944445', '1661161005', '1639910073', '1766497338', '1866209975', '1868375742', '1873159935',
      '1643361171', '1618661652', '1616572160', '1762499841', '1866664492', '1611827726', '1761550657', '1766934362', '1867559604', '1771978382', '1622292561', '1619745527', '1611155916', '1641375925', '1621338495', '1771957448', '1620583035',
      '1617796995', '1761036013', '1643872784', '1618057081', '1643550405', '1614247799', '1617638254', '1761090835', '1642535922', '1867866843', '1762471422', '1622324614', '1619824326', '1620813512', '1611362174', '1764577191', '1642589365',
      '1619437124', '1613317911', '1611899416', '1614287798', '1612782085', '1610756192', '1772538029', '1761377014', '1613087501', '1642321324', '1760990063', '1617508984', '1612506903', '1636161724', '1621899496', '1617961758'
    ]
    console.log(arr.length)
    // let count = 0
    // for (const i in arr) {
    //   const data = {
    //     type: 1,
    //     bar_code: arr[i]
    //   }
    //   barCodeUnbindApi(data).then(res => {
    //     console.log(res)
    //     if (res.code === 200) {
    //       console.log(arr[i])
    //       count++
    //       console.log(count)
    //     }
    //   })
    // }
  },
  methods: {
    submitForm() {
      this.$confirm(`是否确认用解除条码" ${this.form.bar_code} "所属的大码所有关联？`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        // console.log(this.ruleForm)
        const data = {
          type: this.form.type,
          bar_code: this.form.bar_code.trim()
        }
        console.log(data)
        barCodeUnbindApi(data).then(res => {
          console.log(res)
          if (res.code === 200) {
            this.$message({
              type: 'success',
              message: '解除成功!!'
            })
            this.form = {
              type: '',
              bar_code: ''
            }
          }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消'
        })
      })
    }
  }
}
</script>

<style scoped>
  .card {
    font-size: 12px;
    color:#aaa;
  }
  .card li {
    line-height: 20px;
  }
</style>
